body {
    font-family: "Microsoft Yahei", "Hiragino Sans GB", Arial, Lucida, Verdana, SimSun, Helvetica, sans-serif !important;
    /*font-size : 62.5%; px数值除以10，然后换上em作为单位*/
    /*min-width:980px;*/
    font-size: 12px !important;
}

a {
    color: #51a7e5;
}

.toolbar-icon .webix_icon_button .webix_icon {
    color: white !important;
    font-size: 14px;
}

input {
    border-radius: 3px !important;
}

.toolbar-title {
    font-size: 14px;
    font-weight: 600;
    padding-top: 3px;
}


button {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px !important;
}

.page-nav {
    box-shadow: 4px 4px 20px 1px rgb(172 170 170 / 25%);
    background-color: #0078da!important;
    /*background-image: url("/static/images/nav-bg.png") !important;*/
    border-width: 0px 0px 0px 0px!important;
}

.page-nav .webix_secondary .webix_button,
.page-nav .webix_secondary .webix_button:active,
.page-nav .webix_secondary .webix_button:hover,
.page-nav .webix_secondary .webix_button:focus {
    background-color: #daddeb00;
    font-size: 13px;
}

.page-nav .webix_secondary .webix_button .webix_icon,
.page-nav .webix_secondary .webix_button .webix_icon_btn,
.page-nav .webix_secondary .webix_button .webix_img_btn_text {
    color: #d9d9d9;

}

.account-menu .webix_secondary .webix_button,
.account-menu .webix_secondary .webix_button:active,
.account-menu .webix_secondary .webix_button:hover,
.account-menu .webix_secondary .webix_button:focus {
    background-color: rgb(255, 255, 255);
    font-size: 13px;
}

.account-menu .webix_secondary .webix_button .webix_icon,
.account-menu .webix_secondary .webix_button .webix_icon_btn,
.account-menu .webix_secondary .webix_button .webix_img_btn_text {
    color: #1fa5c6;

}


.page-nav .page-nav .webix_menu,
.page-nav .webix_menu-x .webix_list_item {
    font-size: 14px;
    background-color: #1992af00;
}

.page-nav .webix_menu-x .webix_list_item:active,
.page-nav .webix_menu-x .webix_list_item:focus,
.page-nav .webix_menu-x .webix_list_item:hover {
    background-color: #1992af00;
}

.webix_menu-x .webix_list_item:first-child {
    margin-left: 0;
}

.page-nav .webix_menu .webix_list_item:active,
.page-nav .webix_menu .webix_list_item:focus,
.page-nav .webix_menu .webix_list_item:hover,
.page-nav .webix_menu-x .webix_list_item:active,
.page-nav .webix_menu-x .webix_list_item:focus,
.page-nav .webix_menu-x .webix_list_item:hover {
    background: hsla(0, 0%, 39%, .1);
}

.nav-logo {
    background-color: #0078da!important;
    border: none;
}

.nav-logo .webix_template {
    padding-left: 1px;
}



/*SideBar*/
/*.webix_sidebar{*/
/*    border-color: #f1f1f1;*/
/*    background-color: #f1f1f1;*/
/*    font-size: 13px;*/
/*}*/

.nav-item .webix_img_btn {
    color: #f0f0f0;
    background: #f0f8ff00;
}

.nav-item .webix_icon_btn {
    color: #f2f2f2;
}


.nborder-input {
    margin-top: 0px !important;
}

.nborder-input textarea,
.nborder-input input {
    border: none;
    border-bottom: 1px solid rgba(157, 157, 157, 0.71);
    background: #ffffff00;
}

.nborder-input2 input,
.nborder-input2 .webix_inp_static {
    border: none;
    border-bottom: 1px solid #bbbbbb;
    background: rgba(255, 255, 255, 0);
}

.nborder-input3 input,
.nborder-input3 .webix_inp_static {
    border: none;
    border-bottom: none;
    background: rgba(255, 255, 255, 0);
}

.webix_view.webix_fieldset fieldset {
    border: 1px solid #dadee0 !important;
    background: #fafafa !important;
    border-radius: 4px;
}

.webix_view.webix_fieldset legend {
    font-family: Roboto, sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: #1ca4c7;
    letter-spacing: 2px;
}


.query-toolbar {
    padding-top: 3px;
    padding-bottom: 3px;
    /*background-color: rgb(244 245 249);*/
}


.win-toolbar {
    height: 40px;
    /*background-color: #d0d0d0;*/
    /*background: linear-gradient(#f4f5f9,#f2f2f2)!important;*/
    /*border-bottom: 1px solid #d6d6d6;*/
}

.win-toolbar .webix_el_label .webix_el_box {
    color: #e7e7e7!important;
}

.win-body {
    border-radius: 7px;
    /*border-top: 1px solid #d6d6d6 !important;*/
    /*border-left: 1px solid #d6d6d6 !important;*/
    /*border-right: 1px solid #d6d6d6 !important;*/
    /*border-bottom: 1px solid #d6d6d6 !important;*/
    /*outline: none !important;*/
    /*background: linear-gradient(#ffffff, #f4f4f4) !important;*/
}

.win-body .webix_view.webix_form {
    /*background-color: #fdfdfd;*/
}


.main-panel {
    background: #2f2f2f;
    border-radius: 2px;
    /*box-shadow: inset -3px -1px 6px 0px rgb(106 106 106 / 70%);*/
    /*box-shadow: 0px 1px 5px 1px rgba(186, 186, 186, 0.24);*/
    /*padding-left: 20px;*/
    /*padding-right: -20px;*/
}

/*.main-panel  .main-panel-box{*/
/*    border: 1px solid rgba(117, 180, 117, 0.2) !important;*/
/*}*/

.panel-box {
    margin-top: 0px !important;
    border-radius: 3px;
    border: 1px solid #a8a8a8;
    background-color: #fcfcfc;
    box-shadow: 1px 1px 5px 0px rgba(177, 177, 177, 0.39);
}

.main-tabs .webix_all_tabs {
    /*background: #e9e9e9;*/
}


.main-toolbar {
    color: #404040;
    box-shadow: 0px 3px 20px 1px rgba(177, 177, 177, 0.35);
!important;
}

.main-toolbar .webix_el_label {
    font-size: 13px !important;
    padding-left: 0;
}

.main-toolbar .webix_icon {
    padding-top: 4px;
    font-size: 1em;
    color: #777777;
}

.toolbar-desc {
    padding: 5px !important;
    color: #00878c !important;
    line-height: 180% !important;
    background: rgba(255, 255, 255, 0);
    border: none;
    font-size: 13px !important;
}

.page-toolbar {
    /*background: #f4f4f4;*/
    /*border: none;*/
}

.page-toolbar.webix_layout_toolbar .webix_el_icon,
.page-toolbar.webix_layout_toolbar .webix_icon_btn,
.page-toolbar.webix_layout_toolbar .webix_icon_button,
.page-toolbar.webix_layout_toolbar .webix_img_btn,
.page-toolbar.webix_layout_toolbar .webix_img_btn_top {
    color: #5e5e5e;
}

.page-toolbar .webix_view.webix_form {
    /*background-color: #fff0;*/
}

.table-btn {
    text-align: center;
    font-weight: bold;
    padding: 7px 15px 6px 13px;
    background: linear-gradient(rgba(236, 236, 236, 0.66), rgba(202, 202, 202, 0.71));
    color: #545454;
    border-radius: 5px;
    font-size: 0.7em;
    cursor: pointer;
    border: 1px solid rgba(145, 145, 145, 0.75);
}

.nborder-input textarea,
.nborder-input input {
    border: none !important;
    border-bottom: 1px solid rgba(134, 134, 134, 0.65) !important;
    background: #ffffff00 !important;
}

.nborder-input2 input,
.nborder-input2 .webix_inp_static {
    border: none;
    border-bottom: 1px solid #bbbbbb;
    background: rgba(255, 255, 255, 0);
}

.statbox {
    border-radius: 5px;
}

.statbox .webix_icon_button:hover:before {
    background-color: #ffffff40;
}

.statbox-bg-alert {
    background-color: #0e7793;
}

.statbox-bg-ticket {
    background-color: #0a8767;
}

.statbox-bg-product {
    background-color: #2571ba;
}


.stat-box-icon .webix_icon {
    color: #d4d4d4 !important;
    font-size: 48px;
    padding-right: 20px;
}

.stat-box-count .webix_el_box {
    padding-top: 10px;
    font-size: 18px;
    font-weight: 500;
    color: #dcdcdc;
}

.stat-box-desc .webix_el_box {
    font-size: 18px;
    font-weight: 700;
    color: #dcdcdc;
}

.tags--space, .webix_el_textarea textarea {
    background: #a2a2a2;
    font-family: Roboto, sans-serif;
    border-color: #adadad;
    font-size: 14px;
    color: #464646;
    /*letter-spacing: 3px!important;*/
}

.quickLinks-item .webix_img_btn {
    font-weight: 500;
    color: #1ca1c1;
}

.quickLinks-item .webix_img_btn .webix_icon_btn {
    color: #1ca1c1;
}

.main-panel .webix_layout_wide {
    background-color: #fdfdfd;
}

.panel-toolbar {
    background: linear-gradient(#2d2d2d,#2d2d2d);
}

.dash-title,
.dash-title .webix_el_box {
    color: #f6f6f6 !important;
    padding-left: 20px;
    padding-top: 5px;
    letter-spacing: 1px !important;
    font-size: 13px !important;
    font-weight: 100 !important;
}

.sidebar-head {
    background: linear-gradient(#ffffff, #efefef);
}

.sidebar-head .webix_icon_btn {
    color: #e93e31;
    font-size: 50px !important;
}

.sidebar-head .text {
    padding-top: 10px;
    line-height: 140%;
    background: #f8f8f8;
    font-size: 13px;
    color: #484848;
}


.dataview-box {
    background-color: #e1e4e4;
}

.dataview-item {
    padding: 10px;
}

.dataview-item .dataview-item-icon {
    padding-top: 10px;
    color: #177991;
    font-size: 40px;
    float: left;
    width: 60px;
}

.dataview-item .dataview-item-dashimg {
    padding-top: 10px;
}

.dataview-item .dataview-item-dashblock {
    width: 320px;
}

.dataview-item .dataview-item-dashblock .remark-box {
    height: 60px;
}

.dataview-item .dataview-item-dashblock .head {
    font-weight: 600;
    color: #2ca3c3;
    padding-right: 5px;
}

.dataview-item .dataview-item-block {
    float: right;
    padding-right: 10px;
    width: 200px;
}

.dataview-item .dataview-item-block .head {
    font-weight: 600;
    color: #2ca3c3;
    padding-right: 5px;
}

.dataview-item .dataview-item-actions {
    padding-top: 10px;
}

.dataview-item .progressbar {
    background-color: rgba(0, 0, 0, 0);
    border-radius: 3px;
    /* (height of inner div) / 2 + padding */
    padding: 5px;
    margin-top: 3px;
}

.dataview-item .progressbar > div {
    background-color: #1ca1c1;
    height: 10px;
    /* margin-top: 2px; */
    border-radius: 5px;
    display: inline-block;
    font-size: 9px;
    color: white;
    text-align: center;
    vertical-align: middle;
    padding-bottom: 9px;
}

.quicklink-box {
    background-color: #e1e4e4;
}

.quicklink-box .webix_dataview {
    padding: 5px;
}

.quicklink-box .webix_dataview_item {
    /*margin: 15px!important;*/
    margin-right: 7px;
    margin-top: 7px;
    background: linear-gradient(#e9e9e9, #f1f1f1);
    border-radius: 3px;
}

.quicklink-item {
    width: 120px;
    padding-top: 10px;
    text-align: center;
}

.quicklink-item .quicklink-item-icon {
    text-align: center;
    padding-top: 10px;
    color: #1fa5c6;
    font-size: 60px;
    width: 60px;
}


.quicklink-item .quicklink-item-icon, mdi {
    padding-left: 30px;
}

.quicklink-item .quicklink-item-title {
    text-align: center;
    font-weight: 500;
    color: #575757;
    padding-top: 20px;
}

.extlink-box {
    background-color: #e1e4e4;
}

.extlink-item {
    padding: 5px;
}

.extlink-item .extlink-item-icon {
    padding-top: 10px;
    color: #177991;
    font-size: 40px;
    float: left;
    width: 36px;
}

.extlink-item .extlink-item-block {
    float: right;
    padding-top: 10px;
    padding-right: 20px;
    width: 240px;
}

.extlink-item .extlink-item-block .head {
    font-weight: 600;
    font-size: 18px;
    color: #2ca3c3;
    padding-right: 5px;
}


.sidbar-button {
    background: linear-gradient(#fcfcfc, #f5f5f5) !important;
    font-size: 13px;
}

.sidbar-button .webix_img_btn {
    font-size: 13px;

}

.sidbar-button .webix_icon_btn {
    color: #2ca3c3;
}

.sidbar-button .webix_img_btn:hover,
.sidbar-button .webix_img_btn_top:hover,
.sidbar-button .webix_img_btn:active,
.sidbar-button .webix_img_btn_top:active {
    background: linear-gradient(#ffffff, #f9f9f9) !important;
}

.dash_carousel .webix_template {
    background: #e5e5e5;
    padding-left: 20px;
}

.alert-light-red .mdi-brightness-1:before {
    color: #ff0000;
}

.alert-light-orange .mdi-brightness-1:before {
    color: #ffa500;
}

.alert-light-green .mdi-brightness-1:before {
    color: #00c400;
}

.settings-list .settings-members {
    background-color: rgba(255, 255, 255, 0);
}

.settings-list .settings-members .item {
    padding-bottom: 7px;
    height: 38px;
}

.settings-list .settings-members .item img {
    padding-right: 10px;
    float: left;
}

.settings-list .settings-members .item span {
    height: 38px;
    padding-bottom: 7px;
    float: left;
}

.settings-list {
    background-color: #313131;
}

.nav-toggle {
    padding-top: 3px;
    color: #9effff !important;

}

.nav-toggle .webix_icon_btn {
    font-size: 27px;
}

.event-detail {
    cursor: hand;
}

.dashboard-metrics-item {
    padding: 10px;
    background: #f2f2f2;
    border-radius: 7px;
    margin: 5px;
}

.dashboard-metrics-item .icon {
    padding-left: 20px;
    font-size: 20px;
    font-weight: 600;
    color: #7b8291;
}

.dashboard-metrics-item .value {
    padding-left: 20px;
    font-size: 1em;
    font-weight: 500;
}

.dashboard-metrics-item .desc {
    padding-left: 16px;
    font-size: 1em;
    font-weight: 500;
}

.dashboard-metrics-item .link {
    float: right;
    color: #6f6c74;
    font-size: 1.2em;
    font-weight: 500;
    cursor: pointer;
}


.nav-m-title,
.nav-m-title .webix_el_box {
    color: #f6f6f6 !important;
    padding-left: 20px;
    /*padding-top: 3px;*/
    margin-top: 5px;
    letter-spacing: 1px !important;
    font-size: 1em !important;
    font-weight: 600 !important;
}

.nav-s-title,
.nav-s-title .webix_el_box {
    color: #dedede!important;
    /*padding-left: 7px;*/
    padding-top: 2px;
    letter-spacing: 1px!important;
    font-size: 12px!important;
    font-weight: 500!important;
}


.nav-menus {
    border: none;
    padding-top: 13px;
}

.nav-menus .webix_list_item {
    float: right;
    border-left: 0;
    border-right: 1px dashed #616161 !important;
    padding: 0 15px 0 10px !important;
    color: #fff;
    height: 28px !important;
    border-radius: 0 !important;
}

.redirect-page .view-nav {
    display: none !important;
}


.module-list {
    background-color: rgba(255, 255, 255, 0);
}

.module-list .item {
    padding-bottom: 7px;
    height: 38px;
}

.module-list .item img {
    padding-right: 10px;
    float: left;
}

.module-list .item span {
    height: 38px;
    padding-bottom: 7px;
    float: left;
}

.module-list .webix_list_item.webix_selected {
    box-shadow: inset 2px 0 #1ca1c1;
    background: #d4eef5;
}

.sidebar-title .webix_el_box {
    color: gray;
    font-weight: 800;
    font-size: 1em;
    padding-top: 5px;
}

.toggle-img .webix_image {
    width: 18px !important;
    height: 24px !important;
}

.global-datetime .webix_el_box {
    color: #c1c1c1 !important;
}

.form-desc {
    padding: 5px 7px 5px 7px;
    background: #f6f6f60a;
}

.form-desc .webix_template {
     font-size: 11px!important;
}

.web-console {
    background-color: #004e55;
    color: #f8f8f8;
    padding: 5px;
}

.customer-infoview {

}

.customer-infoview .webix_dataview {
    padding: 5px;
}

.customer-infoview .webix_dataview_item {
    margin-right: 5px;
    margin-top: 5px;
    border: none !important;
    background: #ffffff;
    box-shadow: none;
}

.customer-infoview .item {
    padding-top: 5px;
    border: none !important;
}

.mymetrics {
    background-image: linear-gradient(23deg, rgba(0, 140, 248, 0.65) 0px, rgba(16, 166, 255, 0.66) 90%) !important;
    border-radius: 5px;
}

.webix_template .widget-metrics {

}

.webix_template .widget-metrics .detail {
    float: left;
    padding-left: 20px;
    padding-top: 15px;
}

.webix_template .widget-metrics .icon {
    float: left;
    font-size: 3.2em;
    color: #eeeeee;
    height: 40px;
    padding-left: 10px;
    padding-top: 7px;
}

.webix_template .widget-metrics .value {
    font-size: 1.4em;
    color: #eeeeee;
}

.webix_template .widget-metrics .title {
    font-size: 1em;
    color: #eeeeee;
    padding-top: 3px;
}


.cpe-infoview {

}

.cpe-infoview .webix_dataview {
    padding: 5px;
}

.cpe-infoview .webix_dataview_item {
    margin-right: 5px;
    margin-top: 5px;
    border: none !important;
    background: #ffffff;
    box-shadow: none;
}

.cpe-infoview .item {
    padding-top: 5px;
    border: none !important;
}

.Up-row {
    color: green;
}

.Down-row {
    color: red;
}

.Enabled-row {
    color: green;
}

.Disabled-row {
    color: red;
}

.true-row {
    color: #000000;
}

.false-row {
    color: gray;
}

.dataPager {
    vertical-align: middle !important;
}

/*.webix_all_tabs .webix_item_tab.webix_selected:hover {*/
/*    background-color: rgba(174, 174, 174, 0.17);*/
/*}*/

/*.webix_item_tab.webix_selected {*/
/*    border-bottom-width: 0;*/
/*    background-color: rgba(198, 198, 198, 0.17);*/
/*}*/

.webix_all_tabs .webix_item_tab {
    /*border-top: #e8e8e8 solid 1px;*/
    /*border-right: #e8e8e8 solid 1px;*/
    color:#8e8e8e;
    border-bottom-width: 0;
    border-left-width: 0;
    border-top-right-radius: 15px;
    text-decoration: none !important;
    /*background: #e3e3e3;*/
}

.webix_all_tabs .webix_item_tab.webix_selected:focus {
    color: #d9d9d9;
    box-shadow: none;
}

.webix_all_tabs .webix_item_tab:hover {
    background-color: rgba(145, 145, 145, 0.42);
}


.webix_inp_bottom_label {
    font-size: 10px;
    color: #696969;
}

.webix_el_colorpicker input:focus, .webix_el_combo input:focus, .webix_el_datepicker .webix_inp_static:focus, .webix_el_datepicker input:focus, .webix_el_richselect .webix_inp_static:focus, .webix_el_search input:focus, .webix_el_select select:focus, .webix_el_text input:focus, .webix_el_textarea textarea:focus {
    box-shadow: none;
    border: 1px solid #858585;
}

.webix_sidebar .webix_tree_branch_1 > .webix_tree_item,
.webix_sidebar .webix_tree_item {
    color: #2d2d2d;
    cursor: pointer;
    /* background: #fefefe; */
    border-bottom: 1px solid #ebebeb !important;
}

.webix_sidebar {
    background: linear-gradient(45deg, #ffffff,#f4f5f9)!important
}


.detail-form .webix_control,
.detail-form .webix_control .webix_el_box {
    margin-top: 0px !important;
    font-size: 11px !important;
    /*height: 30px !important;*/
}

.detail-form .webix_control .webix_el_box .webix_template {
    font-size: 11px !important;
    /*color: #5f5f5f;*/
}

/*.detail-form .webix_control .webix_inp_label ,*/

.detail-form .webix_control .webix_el_box label {
    /*height: 27px !important;*/
    /*color: #636363;*/
    font-size: 11px !important;
    font-weight: 500;
}

.detail-form .webix_control .webix_el_box input {
    /*height: 27px !important;*/
    /*color: #5f5f5f;*/
    border: 0 !important;
    border-bottom: 1px solid #525252 !important;
    background: #ffffff00 !important;
}

.webix_popup.webix_sidemenu.webix_sidemenu_right {
    border: 0;
    box-shadow: -7px 8px 18px 2px rgba(0, 0, 0, .1);
}

.webix_property_label {
    font-size: 14px;
    font-weight: 600;
    color: #8b8b8b !important;
    height: 32px;
}

.webix_property_value {
    height: 32px;
}

.log-template .webix_template {
    font-size: 13px;
    line-height: 180%;
    padding: 15px;
    word-wrap: break-word;
    background: #444444;
}

.web-console .log-info {
    color: #f2f2f2;
    line-height: 180%;
}
.web-console .log-debug {
    color: #00ffd8;
    line-height: 180%;
}
.web-console .log-warning {
    color: #ff8e00;
    line-height: 180%;
}
.web-console .log-error {
    color: #ff5757;
    line-height: 180%;
}

.snmp-status_error {
    color: red!important;
}
.snmp-status_success {
    color: green !important;
}


.statuscss_error, .statuscss_failure {
    color: red!important;
}
.statuscss_success, .statuscss_online{
    color: green !important;
}

.statuscss_unknow, .statuscss_offline {
    color: #4e4e4e !important;
}


.loglevel-info {
    color: green !important;
}

.loglevel-error {
    color: red !important;
}


.iframe-page{
    border: none;
}

.page-toolbar  .webix_el_label .webix_el_box {
    color: #caced3!important;
}


.CodeMirror {
    background: #d9d9d9 !important;
}

.CodeMirror-gutters {
    background-color: #d1d1d1!important;
}

.opr-head img {
    border-radius: 12px;
}

.codebox {
    background: #282828 !important;
    padding: 20px;

}

.codebox {
    color: #c2c2c2 !important;
    font: 12px/1.5 Consolas, "Liberation Mono", Menlo, Courier, monospace !important;
}